<template>
    <el-table :data="tableData">
    <el-table-column type="selection" width="55" />
    <el-table-column prop="stuNo" label="ID" width="200" />
    <el-table-column prop="stuName" label="值班人员" width="200" />
    <el-table-column prop="image" label="监控实时图" width="200">
      <template #default="scope">
        <el-image :src="scope.row.image" style="width: 50px; height: 50px" />
      </template>
    </el-table-column>
    <el-table-column prop="bourn" label="监控分布位置" width="200" />
    <el-table-column prop="collegeName" label="门禁情况" width="200">
      <template #default="scope">
        <el-switch
          :active-value="true"
          :inactive-value="false"
          v-model="scope.row.switch"
          inline-prompt
          active-text="已打卡"
          inactive-text="未打卡"
          style="width: 100px;"
        />
      </template>
    </el-table-column>
    <el-table-column prop="expertiseName" label="班级人数" width="200" />
    <el-table-column fixed="right" label="操作" width="200">
      <template #default>
        <el-button type="primary" size="small">查看</el-button>
        <el-button type="primary" size="small">编辑</el-button>
        <el-button type="primary" size="small">删除</el-button>
      </template>
    </el-table-column>
  </el-table>
</template>

<script setup lang="ts">
import { getStudentStatsDi } from '@/api/server';
import {ref} from 'vue'
const tableData: any = ref([]);

async function Security(){
   const res = await getStudentStatsDi();
   console.log(res.data.data.result[0].list,'res=<>==');
   tableData.value = res.data.data.result[0].list
}

Security();
</script>

<style scoped>
.el-table {
  width: 100%;
  height: 70vh;
  overflow: scroll;
}
</style>